@charset "utf-8";
$font-size:12;/**********变量元素*********/
@function bgg($px){/************函数样式************/
    @return $px/$font-size*(640/640)*1rem;
}
html{/**************html根字体大小**************/
    font-size: $font-size*1px;
}

/***********这里是页面*********/
.web{
    width: 100%;
    height: 100%;
    margin: 0 auto;
    header{
        /***********头部样式************/
    }
    section{/**********这里是内容样式**********/
        width: 100%;
        height: 100%;
        margin: 0 auto;
        text-align: center;
        background: rgba(0,0,0,0.8);
        display: inline-block;
        .section{
            .logo{
                margin-top: bgg(192);
                
                img{
                    width: bgg(161);
                    height: bgg(136);
                    
                }
            }
            .input{
                margin-top: bgg(45);
                position: relative;
                input{
                    width: bgg(492);
                    height: bgg(53);
                    background: #3d3d3d;
                    color: #cdcdcd;
                    font-size: bgg(20);
                    border: none;
                    padding-left: bgg(97);
                    padding-right: bgg(20);
                    box-sizing: border-box;
                    line-height: bgg(53);
                    word-break: break-all;
                }
                input::-webkit-input-placeholder{
                    color: #cdcdcd;
                    font-size: bgg(20);
                }
                .img_1{
                    width: bgg(62);
                    height: bgg(53);
//                  float: left;
                    background: #303030;
                    line-height: bgg(53);
                    position: absolute;
                    top: 0;
                    left: bgg(73);
//                  display: inline-block;
                    img{
//                  display: inline-block;
                    margin-top: bgg(10);
                    }
                }
            }
            .input_1{
                margin-top: bgg(14);
            }
//          input::-webkit-input-placeholde{
//              color: #cdcdcd;
//              font-size: bgg(20);
//          }
            .password{
                text-decoration: none;
                color: #ffffff;
                font-size: bgg(19.53);
                margin-top: bgg(19);
                margin-right: bgg(75);
                margin-left: bgg(5);
                &:active{
                    color: red;
                }
            }
            .passwd{
                margin-top: bgg(24);
            }
            .register{
                text-align: center;
                margin-top: bgg(60);
                a{
                    display: inline-block;
                    width: bgg(492);
                    height: bgg(53);
                    background: #b60005;
                    text-decoration: none;
                    text-align: center;
                    line-height: bgg(53);
//                  &:active{
//                      color: red;
//                  }
                    span{
                        color: #cdcdcd;
                        font-size: bgg(23.08);
                        &:active{
                            color: red;
                        }
                    }
                }
            }
            .login{
                margin-top: bgg(15);
                a{
                    background: #303030;
                    border: bgg(1) solid #2e1f20;
                }
                .login_1{
                    color: #cdcdcd;
                }
            }
        }
    }
    footer{
        /*************这里是尾部样式*************/
    }
}
